<template>
    <div id="orderSearchDiv">
        <div id="dataViewDiv">
            <div style="margin-left:20px">
                <el-date-picker
                    v-model="dataViewRange"
                    type="daterange"
                    align="right"
                    unlink-panels
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                    value-format="yyyy-MM-dd"
                    :picker-options="pickerOptions"
                    @change="changeDataViewDate"
                ></el-date-picker>
            </div>
            <div style="margin-top:20px;">
                <div id="share_total_flex">
                    <div class="total_row_item">
                        <div class="order_content">
                            <div class="order_total_title">分享次数</div>
                            <div class="order_total_info">
                                <span class="order_data">{{ totalData.shareNum }}</span>
                            </div>
                        </div>
                    </div>
                    <div class="total_row_item">
                        <div class="order_content">
                            <div class="order_total_title">注册用户数</div>
                            <div class="order_total_info">
                                <span class="order_data">{{ totalData.invitedNum }}</span>
                            </div>
                        </div>
                    </div>
                    <div class="total_row_item">
                        <div class="order_content">
                            <div class="order_total_title">完成首单用户数</div>
                            <div class="order_total_info">
                                <span class="order_data">{{ totalData.finishNum }}</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="form1" style="text-align:center;margin-top:30px;margin-left:35px">
            <el-form
                :inline="true"
                :model="formInline"
                class="demo-form-inline"
                @keyup.enter.native="search()"
                id="orderSearchForm"
            >
                <el-form-item label="分享活动名称" style="margin-left:50px;">
                    <br> <br>
                    <el-input v-model="formInline.activityName" placeholder style="margin-left:-85px;width:200px"></el-input>
                </el-form-item>
                <el-form-item label="　分享人名称" style="margin-left:-60px;">
                    <br> <br>
                    <el-input v-model="formInline.shareName" placeholder style="margin-left:-85px;width:200px"></el-input>
                </el-form-item>
                <el-form-item label="分享人手机号"  style="margin-left:-60px;">
                    <br> <br>
                    <el-input v-model="formInline.sharePhone" placeholder style="margin-left:-85px;width:200px"></el-input>
                </el-form-item>
                   <el-form-item label="　受邀人名称"  style="margin-left:-60px;">
                       <br> <br>
                    <el-input v-model="formInline.invitedName" placeholder style="margin-left:-85px;width:200px"></el-input>
                </el-form-item>
                <el-form-item label="受邀人手机号"  style="margin-left:-60px;">
                    <br> <br>
                    <el-input v-model="formInline.invitedPhone" placeholder style="margin-left:-85px;width:200px"></el-input>
                </el-form-item>
                    <br />
            
            
                <el-form-item label="　　分享类型" style="margin-left:50px;">
                    <br> <br>
                    <el-select v-model="formInline.shareType" placeholder="请选择" clearable style="margin-left:-85px;width:200px">
                        <el-option label="普通分享" value="1"></el-option>
                    </el-select>
                </el-form-item>
                  <el-form-item label="是否完成首单" style="margin-left:-60px;">
                      <br> <br>
                    <el-select v-model="formInline.isFinish" placeholder="请选择" clearable style="margin-left:-85px;width:200px">
                        <el-option label="是" value="1"></el-option>
                        <el-option label="否" value="0"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="　　受邀时间" style="margin-left:-60px;">
                    <br> <br>
                    <el-date-picker
                        v-model="formInline.invitedDateRange"
                        type="daterange"
                        align="right"
                        style="margin-left:-85px;width:430px"
                        unlink-panels
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        value-format="yyyy-MM-dd"
                        :picker-options="pickerOptions"
                    ></el-date-picker>
                </el-form-item>
              
                   
                <br />
             
                <el-form-item label="完成首单时间" style="margin-left:40px;">
                    <br> <br>
                    <el-date-picker
                        v-model="formInline.finishDateRange"
                        type="daterange"
                        align="right"
                        unlink-panels
                        style="margin-left:-85px;width:430px"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        value-format="yyyy-MM-dd"
                        :picker-options="pickerOptions"
                    ></el-date-picker>
                </el-form-item>
                 <el-form-item label="　　分享时间" style="margin-left:170px;">
                     <br> <br>
                    <el-date-picker
                        v-model="formInline.shareDateRange"
                        type="daterange"
                        align="right"
                        style="margin-left:-85px;width:430px"
                        unlink-panels
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        value-format="yyyy-MM-dd"
                        :picker-options="pickerOptions"
                    ></el-date-picker>
                </el-form-item>
                <el-form-item
                    id="multiBtnDiv"
                   style="margin-left:700px;text-align:right"
                >
                    <el-button type="primary" @click="search()" size="mini" icon="el-icon-search">查询</el-button>
                    <el-button type="primary" @click="kong()" size="mini" icon="el-icon-delete">清空</el-button>
                    <el-button
                        type="success"
                        @click="exportExcel()"
                        size="mini"
                        icon="el-icon-s-data"
                        :loading="exportLoading"
                    >导出</el-button>
                </el-form-item>
            </el-form>
        </div>
        <div class="table1">
          <el-table
            id="rebateSetTable"
            ref="table1"
            tooltip-effect="dark"
            style="width: 100%;"
         
            v-loading="loading"
            :data="tableData"
            border
            :header-cell-style="{background:'#eef1f6',color:'#606266'}"
          >
                <el-table-column type="index" label="序号" align="center" width="60" ></el-table-column>
                <el-table-column
                    v-for="(item, index) in col"
                    :key="`col_${index}`"
                    :prop="dropCol[index].prop"
                    :width="dropCol[index].width"
                    :label="item.label"
                    show-overflow-tooltip
                  height="500px"
                ></el-table-column>
                
                <!-- <el-table-column prop="activityName" label="分享活动名称" align="center" width="200" show-overflow-tooltip></el-table-column>
          <el-table-column prop="shareName" label="分享人名称" align="center"  width="150" show-overflow-tooltip></el-table-column>
          <el-table-column prop="sharePhone" label="分享人手机号" align="center"  width="150" show-overflow-tooltip></el-table-column>
          <el-table-column prop="shareTypeName" label="分享类型" align="center" width="150" show-overflow-tooltip></el-table-column>
          <el-table-column prop="shareTime" label="分享时间" align="center" width="150" show-overflow-tooltip></el-table-column>
          <el-table-column prop="invitedName" label="受邀人名称" align="center" width="150" show-overflow-tooltip></el-table-column>
          <el-table-column prop="invitedPhone" label="受邀人手机号" align="center" width="150" show-overflow-tooltip></el-table-column>
          <el-table-column prop="invitedTime" label="受邀时间" align="center" width="150" show-overflow-tooltip></el-table-column>
          <el-table-column prop="isFinishName" label="是否完成首单" align="center" width="150" show-overflow-tooltip></el-table-column>
          <el-table-column prop="finishTime" label="完成首单时间" align="center" width="150" show-overflow-tooltip></el-table-column>
                <el-table-column prop="gifts" label="完成首单获得赠品" align="center" width="200" show-overflow-tooltip></el-table-column>-->
            </el-table>
            <el-form :inline="true" :model="formInline">
                <el-form-item style="margin-top: 0px;"></el-form-item>
            </el-form>
            <div class="block" style="margin-top:-22px">
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :page-sizes="[10, 20, 30, 50, 100, 150, 200]"
                    :current-page="listQuery.current"
                    :page-size="listQuery.size"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total"
                ></el-pagination>
            </div>
        </div>
    </div>
</template>

<script>
import Sortable from 'sortablejs';
import {
  queryMemberShareTotal,
  queryMemberShareInvitedRecordByPage,
  queryMemberShareInvitedRecord,
  excelMemberShareInvitedRecord
} from "@/api/memberShareRecord";
import qs from "qs";
import FileSaver from 'file-saver';
import XLSX from 'xlsx';

const curDateStr = function (){
  var curDate = new Date();
  var year = curDate.getFullYear();
  var month = curDate.getMonth() + 1;
  month = month > 9 ? month : "0" + month;
  var date = curDate.getDate();
  date = date > 9 ? date : "0" + date;
  return year + "-" + month + "-" + date;
}
export default {
  data() {
    return {
      logininfo: "",
      orgSeq: "",
      orgType: "",
      loading: true,
      exportLoading: false,
      dataViewRange: "",
      totalData: {
        shareNum: 0,
        invitedNum: 0,
        finishNum: 0
      },
      formInline: {
        activityName: "",
        shareName: "",
        sharePhone: "",
        shareDateRange: "",
        shareType: "",
        invitedName: "",
        invitedPhone: "",
        invitedDateRange: "",
        isFinish: "",
        finishDateRange: ""
      },
      tableData: [],//分享活动列表数据
      total: 0,
      listQuery: {
        current: 1,
        size: 100
      },
      sort: "",
      order: "",
      pickerOptions: {
        shortcuts: [
          {
            text: "最近3天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 3);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            }
          }
        ],
      },
      col: [
        {
          label: '分享活动名称',
          prop: 'activityName',
          width:"200"
        },
        {
          label: '分享人名称',
          prop: 'shareName',
          width:"150"
        },
        {
          label: '分享人手机号',
          prop: 'sharePhone',
          width:"150"
        },
        {
          label: '分享类型',
          prop: 'shareTypeName',
          width:"150"
        },
        {
          label: '分享时间',
          prop: 'shareTime',
          width:"150"
        },
        {
          label: '受邀人名称',
          prop: 'invitedName',
          width:"150"
        },
        {
          label: '受邀人手机号',
          prop: 'invitedPhone',
          width:"150"
        },
        {
          label: '受邀时间',
          prop: 'invitedTime',
          width:"150"
        },
        {
          label: '是否完成首单',
          prop: 'isFinishName',
          width:"150"
        },
        {
          label: '完成首单时间',
          prop: 'finishTime',
          width:"150"
        },
        {
          label: '完成首单获得赠品',
          prop: 'gifts',
          width:"200"
        }
      ],
      dropCol: [
        {
          label: '分享活动名称',
          prop: 'activityName',
          width:"200"
        },
        {
          label: '分享人名称',
          prop: 'shareName',
          width:"150"
        },
        {
          label: '分享人手机号',
          prop: 'sharePhone',
          width:"150"
        },
        {
          label: '分享类型',
          prop: 'shareTypeName',
          width:"150"
        },
        {
          label: '分享时间',
          prop: 'shareTime',
          width:"150"
        },
        {
          label: '受邀人名称',
          prop: 'invitedName',
          width:"150"
        },
        {
          label: '受邀人手机号',
          prop: 'invitedPhone',
          width:"150"
        },
        {
          label: '受邀时间',
          prop: 'invitedTime',
          width:"150"
        },
        {
          label: '是否完成首单',
          prop: 'isFinishName',
          width:"150"
        },
        {
          label: '完成首单时间',
          prop: 'finishTime',
          width:"150"
        },
        {
          label: '完成首单获得赠品',
          prop: 'gifts',
          width:"200"
        }
      ],

    };
  },
  mounted() {
    /*this.logininfo = localStorage.getItem("logininfo");
    let orgJson = JSON.parse(this.logininfo);
    if (
      orgJson != null &&
      orgJson.orgList != null &&
      orgJson.orgList.length > 0
    ) {
      this.orgSeq = orgJson.orgList[0].orgSeq;
      this.orgType = orgJson.orgList[0].orgType;
    }*/

    this.queryMemberShareTotal();//加载看板头部信息
    this.queryMemberShareInvitedRecordByPage();//加载订单列表
    document.body.ondrop = function(event) {
      event.preventDefault();
      event.stopPropagation();
    };
    // this.rowDrop()
    this.columnDrop();
  },
  methods: {
    columnDrop() {
      const wrapperTr = document.querySelector('.el-table__header-wrapper tr');
      this.sortable = Sortable.create(wrapperTr, {
        animation: 180,
        delay: 0,
        onEnd: evt => {
          const oldItem = this.dropCol[evt.oldIndex-1];
          this.dropCol.splice(evt.oldIndex-1, 1);
          this.dropCol.splice(evt.newIndex-1, 0, oldItem);
        }
      });
    },
    /*头部看板*/
    queryMemberShareTotal(){
      let shareBeginDate = "";
      let shareEndDate = "";
      if(this.dataViewRange != null && this.dataViewRange.length == 2){
        shareBeginDate = this.dataViewRange[0];
        shareEndDate = this.dataViewRange[1];
      }else{
        this.dataViewRange = "";
      }
      let data = {
        shareBeginDate: shareBeginDate,
        shareEndDate: shareEndDate
      };
      queryMemberShareTotal(data).then(res => {
        if(res != null){
          this.totalData.shareNum = res.result.shareNum;
          this.totalData.invitedNum = res.result.invitedNum;
          this.totalData.finishNum = res.result.finishNum;
        }
      });
    },
    //点击头部时间选择切换为日期状态
    changeDataViewDate(){
      this.queryMemberShareTotal();
    },
    /*会员活动分享列表*/
    queryMemberShareInvitedRecordByPage() {
      let shareBeginDate = "";
      let shareEndDate = "";
      if(this.formInline.shareDateRange != null && this.formInline.shareDateRange.length == 2){
        shareBeginDate = this.formInline.shareDateRange[0];
        shareEndDate = this.formInline.shareDateRange[1];
      }else{
        this.formInline.shareDateRange = "";
      }
      let invitedBeginDate = "";
      let invitedEndDate = "";
      if(this.formInline.invitedDateRange != null && this.formInline.invitedDateRange.length == 2){
        invitedBeginDate = this.formInline.invitedDateRange[0];
        invitedEndDate = this.formInline.invitedDateRange[1];
      }else{
        this.formInline.invitedDateRange = "";
      }
      let finishBeginDate = "";
      let finishEndDate = "";
      if(this.formInline.finishDateRange != null && this.formInline.finishDateRange.length == 2){
        finishBeginDate = this.formInline.finishDateRange[0];
        finishEndDate = this.formInline.finishDateRange[1];
      }else{
        this.formInline.finishDateRange = "";
      }
      let data = {
        current: this.listQuery.current,
        size: this.listQuery.size,
        condition: {
          activityName: this.formInline.activityName.trim(),
          shareName: this.formInline.shareName.trim(),
          sharePhone: this.formInline.sharePhone.trim(),
          shareBeginDate: shareBeginDate,
          shareEndDate: shareEndDate,
          shareType: this.formInline.shareType,
          invitedName: this.formInline.invitedName.trim(),
          invitedPhone: this.formInline.invitedPhone.trim(),
          invitedBeginDate: invitedBeginDate,
          invitedEndDate: invitedEndDate,
          isFinish: this.formInline.isFinish,
          finishBeginDate: finishBeginDate,
          finishEndDate: finishEndDate,
        },
        ascs: [],
        descs: []
      };
      queryMemberShareInvitedRecordByPage(data).then(res => {
        this.loading = false;
        this.tableData = res.records;
        this.total = res.total;
      });
    },
    handleSizeChange(val) {
      this.listQuery.size = val;
      this.queryMemberShareInvitedRecordByPage();
    },
    handleCurrentChange(val) {
      this.listQuery.current = val;
      this.queryMemberShareInvitedRecordByPage();
    },
    //查询
    search() {
      this.listQuery.current = 1;
      this.queryMemberShareInvitedRecordByPage();
    },
    //清空
    kong(){
      this.formInline.activityName = "";
      this.formInline.shareName = "";
      this.formInline.sharePhone = "";
      this.formInline.shareDateRange = "";
      this.formInline.shareType = "";
      this.formInline.invitedName = "";
      this.formInline.invitedPhone = "";
      this.formInline.invitedDateRange = "";
      this.formInline.isFinish = "";
      this.formInline.finishDateRange =  "";
    },
    //全数据页面导出
    exportExcel1(){
      this.exportLoading = true;
      //获取数据
      let shareBeginDate = "";
      let shareEndDate = "";
      if(this.formInline.shareDateRange != null && this.formInline.shareDateRange.length == 2){
        shareBeginDate = this.formInline.shareDateRange[0];
        shareEndDate = this.formInline.shareDateRange[1];
      }else{
        this.formInline.shareDateRange = "";
      }
      let invitedBeginDate = "";
      let invitedEndDate = "";
      if(this.formInline.invitedDateRange != null && this.formInline.invitedDateRange.length == 2){
        invitedBeginDate = this.formInline.invitedDateRange[0];
        invitedEndDate = this.formInline.invitedDateRange[1];
      }else{
        this.formInline.invitedDateRange = "";
      }
      let finishBeginDate = "";
      let finishEndDate = "";
      if(this.formInline.finishDateRange != null && this.formInline.finishDateRange.length == 2){
        finishBeginDate = this.formInline.finishDateRange[0];
        finishEndDate = this.formInline.finishDateRange[1];
      }else{
        this.formInline.finishDateRange = "";
      }
      let data = {
        activityName: this.formInline.activityName.trim(),
        shareName: this.formInline.shareName.trim(),
        sharePhone: this.formInline.sharePhone.trim(),
        shareBeginDate: shareBeginDate,
        shareEndDate: shareEndDate,
        shareType: this.formInline.shareType,
        invitedName: this.formInline.invitedName.trim(),
        invitedPhone: this.formInline.invitedPhone.trim(),
        invitedBeginDate: invitedBeginDate,
        invitedEndDate: invitedEndDate,
        isFinish: this.formInline.isFinish,
        finishBeginDate: finishBeginDate,
        finishEndDate: finishEndDate,
      };
      queryMemberShareInvitedRecord(data).then(res => {
        this.tableDataExcel = res.records;
        if(res.records == null || res.records.length == 0){
          this.$message.error("数据为空无法导出!");
          return;
        }else{
          //要导出去的标题
          var arry = [['分享活动名称','分享人名称','分享人手机号','分享类型','分享时间','受邀人名称','受邀人手机号','受邀时间','是否完成首单','完成首单时间','完成首单获得赠品']];
          this.tableDataExcel.map((a,i) => {
            var _arry = [];
            _arry.push(a.activityName == null ? "" : a.activityName.toString());
            _arry.push(a.shareName == null ? "" : a.shareName.toString());
            _arry.push(a.sharePhone == null ? "" : a.sharePhone.toString());
            _arry.push(a.shareTypeName == null ? "" : a.shareTypeName.toString());
            _arry.push(a.shareTime == null ? "" : a.shareTime.toString());
            _arry.push(a.invitedName == null ? "" : a.invitedName.toString());
            _arry.push(a.invitedPhone == null ? "" : a.invitedPhone.toString());
            _arry.push(a.invitedTime == null ? "" : a.invitedTime.toString());
            _arry.push(a.isFinishName == null ? "" : a.isFinishName.toString());
            _arry.push(a.finishTime == null ? "" : a.finishTime.toString());
            _arry.push(a.gifts == null ? "" : a.gifts.toString());
            return _arry;
          }).forEach(a => {
              arry.push(a);
          });
          var sheet = XLSX.utils.aoa_to_sheet(arry);
          sheet["!cols"] = [{
              wpx: 200 //分享活动名称
          },{
              wpx: 150 //分享人名称
          },{
              wpx: 150 //分享人手机号
          },{
              wpx: 150 //分享类型
          },{
              wpx: 150 //分享时间
          }, {
              wpx: 150//受邀人名称
          }, {
              wpx: 150//受邀人手机号
          }, {
              wpx: 150//受邀时间
          }, {
              wpx: 150//是否完成首单
          }, {
              wpx: 150//完成首单时间
          }, {
              wpx: 200//完成首单获得赠品
          }]; //单元格列宽
          this.exportLoading = false;
          this.openDownloadDialog(this.sheet2blob(sheet), new Date().toLocaleDateString() + '会员分享查询记录表.xlsx');
        }
      });
    },
    //转下载文件
    sheet2blob(sheet, sheetName) {
      sheetName = sheetName || 'sheet1';
      var workbook = {
        SheetNames: [sheetName],
        Sheets: {}
      };
      workbook.Sheets[sheetName] = sheet;
      // 生成excel的配置项
      var wopts = {
        bookType: 'xlsx', // 要生成的文件类型
        bookSST: false, // 是否生成Shared String Table，官方解释是，如果开启生成速度会下降，但在低版本IOS设备上有更好的兼容性
        type: 'binary'
      };
      var wbout = XLSX.write(workbook, wopts);
      var blob = new Blob([s2ab(wbout)], {type:"application/octet-stream"});
      // 字符串转ArrayBuffer
      function s2ab(s) {
        var buf = new ArrayBuffer(s.length);
        var view = new Uint8Array(buf);
        for (var i=0; i!=s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
        return buf;
      }
      return blob;
    },
    //下载文件触发弹窗
    openDownloadDialog(url, saveName){
	    if(typeof url == 'object' && url instanceof Blob){
		    url = URL.createObjectURL(url); // 创建blob地址
	    }
	    var aLink = document.createElement('a');
	    aLink.href = url;
	    aLink.download = saveName || ''; // HTML5新增的属性，指定保存文件名，可以不要后缀，注意，file:///模式下不会生效
	    var event;
	    if(window.MouseEvent){
        event = new MouseEvent('click');
      }else{
		    event = document.createEvent('MouseEvents');
		    event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
	    }
	    aLink.dispatchEvent(event);
    },
    //流导出
    exportExcel(){
      //获取数据
      let shareBeginDate = "";
      let shareEndDate = "";
      if(this.formInline.shareDateRange != null && this.formInline.shareDateRange.length == 2){
        shareBeginDate = this.formInline.shareDateRange[0];
        shareEndDate = this.formInline.shareDateRange[1];
      }else{
        this.formInline.shareDateRange = "";
      }
      let invitedBeginDate = "";
      let invitedEndDate = "";
      if(this.formInline.invitedDateRange != null && this.formInline.invitedDateRange.length == 2){
        invitedBeginDate = this.formInline.invitedDateRange[0];
        invitedEndDate = this.formInline.invitedDateRange[1];
      }else{
        this.formInline.invitedDateRange = "";
      }
      let finishBeginDate = "";
      let finishEndDate = "";
      if(this.formInline.finishDateRange != null && this.formInline.finishDateRange.length == 2){
        finishBeginDate = this.formInline.finishDateRange[0];
        finishEndDate = this.formInline.finishDateRange[1];
      }else{
        this.formInline.finishDateRange = "";
      }
      let data = {
        activityName: this.formInline.activityName.trim(),
        shareName: this.formInline.shareName.trim(),
        sharePhone: this.formInline.sharePhone.trim(),
        shareBeginDate: shareBeginDate,
        shareEndDate: shareEndDate,
        shareType: this.formInline.shareType,
        invitedName: this.formInline.invitedName.trim(),
        invitedPhone: this.formInline.invitedPhone.trim(),
        invitedBeginDate: invitedBeginDate,
        invitedEndDate: invitedEndDate,
        isFinish: this.formInline.isFinish,
        finishBeginDate: finishBeginDate,
        finishEndDate: finishEndDate,
      };
      this.exportLoading = true;
      excelMemberShareInvitedRecord(data).then(res => {
        this.exportLoading = false;
        let blob = new Blob([res], {type: 'application/vnd.ms-excel'});
        const link = document.createElement('a');
        link.style = "display:none";
        link.href = URL.createObjectURL(blob);
        link.download = new Date().toLocaleDateString() + "会员分享查询记录表.xlsx";
        document.body.appendChild(link);
        link.click();
      });
    },

  },
  //其他
  computed: {

  }
};
</script>
<style scoped>
#orderSearchDiv /deep/ #orderSearchForm {
    margin-left: -30px;
    padding: 0;
    display: inline-block;
    text-align: left;
}
#orderSearchDiv /deep/ .el-form--inline .el-form-item__content {
    width: 180px;
}
#orderSearchDiv /deep/ .el-range-editor.el-input__inner {
    width: 250px;
}
#orderSearchDiv /deep/ #multiBtnDiv .el-form-item__content {
    width: 300px;
}
#orderSearchDiv /deep/ .el-dialog__body {
    padding-top: 0;
}
#share_total_flex {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
}
#share_total_flex /deep/ .order_content {
    cursor: pointer;
    width: 300px;
    padding: 20px 0;
    margin: 0 20px;
    text-align: center;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
}
#share_total_flex /deep/ .order_content .order_total_title {
    color: #000;
}
#share_total_flex /deep/ .order_content .order_total_info {
    margin-top: 10px;
}
#share_total_flex /deep/ .order_content .order_data {
    font-size: 1.4em;
    font-weight: bold;
}
</style>
